<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="generator" content="VuePress 2.0.0-beta.24">
    <title>z-paging</title><meta name="description" content="z-paging文档">
    <link rel="preload" href="/assets/js/runtime~app.6593e427.js" as="script"><link rel="preload" href="/assets/css/styles.8c06a1ae.css" as="style"><link rel="preload" href="/assets/js/812.dced0ba1.js" as="script"><link rel="preload" href="/assets/js/app.83bf6016.js" as="script">
    <link rel="stylesheet" href="/assets/css/styles.8c06a1ae.css">
  </head>
  <body>
    <div id="app"><!--[--><div class="theme-container"><header class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><!----><span class="site-name">z-paging</span></a></span><div class="navbar-links-wrapper" style=""><!--[--><!--]--><nav class="navbar-links can-hide"><!--[--><div class="navbar-links-item"><a class="nav-link external" href="https://ext.dcloud.net.cn/plugin?id=3935" rel="noopener noreferrer" target="_blank" aria-label="在插件市场查看"><!--[--><!--]--> 在插件市场查看 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span><!--[--><!--]--></a></div><div class="navbar-links-item"><a class="nav-link external" href="https://github.com/SmileZXLee/uni-z-paging" rel="noopener noreferrer" target="_blank" aria-label="Github"><!--[--><!--]--> Github <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><!----></div></header><div class="sidebar-mask"></div><aside class="sidebar"><nav class="navbar-links"><!--[--><div class="navbar-links-item"><a class="nav-link external" href="https://ext.dcloud.net.cn/plugin?id=3935" rel="noopener noreferrer" target="_blank" aria-label="在插件市场查看"><!--[--><!--]--> 在插件市场查看 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span><!--[--><!--]--></a></div><div class="navbar-links-item"><a class="nav-link external" href="https://github.com/SmileZXLee/uni-z-paging" rel="noopener noreferrer" target="_blank" aria-label="Github"><!--[--><!--]--> Github <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-links"><!--[--><!--[--><p class="sidebar-heading sidebar-item">起步</p><ul class=""><li><!--[--><a href="/start/about.md" class="nav-link sidebar-item" aria-label="介绍"><!--[--><!--]--> 介绍 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/qq-group.md" class="nav-link sidebar-item" aria-label="反馈QQ群"><!--[--><!--]--> 反馈QQ群 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/install.md" class="nav-link sidebar-item" aria-label="安装"><!--[--><!--]--> 安装 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/teaching.md" class="nav-link sidebar-item" aria-label="教学"><!--[--><!--]--> 教学 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/use.md" class="nav-link sidebar-item" aria-label="基本使用"><!--[--><!--]--> 基本使用 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/notice.md" class="nav-link sidebar-item" aria-label="注意事项"><!--[--><!--]--> 注意事项 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/start/performance.md" class="nav-link sidebar-item" aria-label="性能与建议"><!--[--><!--]--> 性能与建议 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a class="nav-link external sidebar-item" href="https://ext.dcloud.net.cn/plugin?id=3935&amp;update_log" rel="noopener noreferrer" target="_blank" aria-label="版本记录"><!--[--><!--]--> 版本记录 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span><!--[--><!--]--></a><!----><!--]--></li></ul><!--]--><!--[--><p class="sidebar-heading sidebar-item">Props</p><ul class=""><li><!--[--><a href="/api/props/global-config.md" class="nav-link sidebar-item" aria-label="全局配置"><!--[--><!--]--> 全局配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/common.md" class="nav-link sidebar-item" aria-label="常规配置"><!--[--><!--]--> 常规配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/reload.md" class="nav-link sidebar-item" aria-label="reload相关配置"><!--[--><!--]--> reload相关配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/refresher.md" class="nav-link sidebar-item" aria-label="下拉刷新配置"><!--[--><!--]--> 下拉刷新配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/loading-more.md" class="nav-link sidebar-item" aria-label="底部加载更多配置"><!--[--><!--]--> 底部加载更多配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/empty.md" class="nav-link sidebar-item" aria-label="空数据与加载失败图配置"><!--[--><!--]--> 空数据与加载失败图配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/loading.md" class="nav-link sidebar-item" aria-label="全屏Loading配置"><!--[--><!--]--> 全屏Loading配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/back-to-top.md" class="nav-link sidebar-item" aria-label="返回顶部按钮配置"><!--[--><!--]--> 返回顶部按钮配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/local-paging.md" class="nav-link sidebar-item" aria-label="本地分页配置"><!--[--><!--]--> 本地分页配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/chat-record-mode.md" class="nav-link sidebar-item" aria-label="聊天记录模式配置"><!--[--><!--]--> 聊天记录模式配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/scroll-view.md" class="nav-link sidebar-item" aria-label="scroll-view相关配置"><!--[--><!--]--> scroll-view相关配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/nvue.md" class="nav-link sidebar-item" aria-label="nvue独有配置"><!--[--><!--]--> nvue独有配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/i18n.md" class="nav-link sidebar-item" aria-label="i18n配置"><!--[--><!--]--> i18n配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/z-index.md" class="nav-link sidebar-item" aria-label="z-index配置"><!--[--><!--]--> z-index配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/api/props/other.md" class="nav-link sidebar-item" aria-label="其他配置"><!--[--><!--]--> 其他配置 <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--><!--[--><a href="/api/slot/index.md" class="nav-link sidebar-heading sidebar-item" aria-label="Slot"><!--[--><!--]--> Slot <!--[--><!--]--></a><!----><!--]--><!--[--><a href="/api/methods/index.md" class="nav-link sidebar-heading sidebar-item active" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----><!--]--><!--[--><a href="/api/events/index.md" class="nav-link sidebar-heading sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----><!--]--><!--]--></ul><!--[--><!--]--></aside><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h2 id="methods" tabindex="-1"><a class="header-anchor" href="#methods" aria-hidden="true">#</a> Methods</h2><div class="custom-container tip"><p class="custom-container-title">调用方式</p><p>假设给z-paging设置ref=&quot;paging&quot;，则通过<code>this.$refs.paging.xxx()</code>方式调用</p></div><div class="custom-container danger"><p class="custom-container-title">注意</p><p>在Page的onLoad()方法中无法同步获取this.$refs，请加一个setTimeOut延时1毫秒或nextTick再调用(默认会在页面加载时自动调用reload()无须手动调用)</p></div><table><thead><tr><th>方法名</th><th>说明</th><th>参数</th></tr></thead><tbody><tr><td>reload</td><td>重新加载分页数据，pageNo恢复为默认值，相当于下拉刷新的效果</td><td>(传true或false，默认为false)reload时是否展示下拉刷新动画，默认为否</td></tr><tr><td>complete或<br>end</td><td>请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging处理<p style="color:red;">(全局错误处理：当请求失败时，也必须调用complete，可在封装的网络请求错误的地方书写：<code>uni.$emit(&#39;z-paging-error-emit&#39;);</code> 即可将当前加载中状态的z-paging设置为请求失败状态)</p></td><td>参数1(必填):请求结果数组；<br>参数2(非必填):是否请求成功，不填默认为true。<br><p style="color:red;">请求失败时直接调用：this.$refs.paging.complete(false); 即可；如果只是想表达请求结束，则调用：this.$refs.paging.complete(); 即可</p></td></tr><tr><td>completeByTotalCount或<br>endByTotalCount</td><td>【通过totalCount判断是否有更多数据】请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging处理</td><td>参数1(必填):请求结果数组；<br>参数2(必填):totalCount(列表总数)<br>参数3(非必填):是否请求成功，不填默认为true</td></tr><tr><td>completeByNoMore或<br>endByNoMore</td><td>【自行判断是否有更多数据】请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging处理</td><td>参数1(必填):请求结果数组；<br>参数2(必填):是否有更多数据，若为true则可以继续滚动到底部加载更多，但如果在某个时刻参数1传入了空数组，也代表着没有更多数据了；<br>参数3(非必填):是否请求成功，不填默认为true</td></tr><tr><td>completeByKey或<br>endByKey</td><td>【保证数据一致】请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging处理<p style="color:red;">(关于数据一致性，请查看demo中<code>consistency-demo.vue</code>文件)</p></td><td>参数1(必填):请求结果数组；<br>参数2(必填):dataKey，需与:data-key绑定的一致；<br>参数3(非必填):是否请求成功，不填默认为true</td></tr><tr><td>clean</td><td>清空分页数据，pageNo恢复为默认值。</td><td>-</td></tr><tr><td>setLocalPaging</td><td>设置本地分页，请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging作分页处理<p style="color:red;">（若调用了此方法，则上拉加载更多时内部会自动分页，不会触发@query所绑定的事件）</p></td><td>参数1(必填):请求结果数组；<br>参数2(非必填):是否请求成功，不填默认为true</td></tr><tr><td>doLoadMore</td><td>手动触发上拉加载更多(非必须，可依据具体需求使用，例如当z-paging未确定高度时，内部的scroll-view会无限增高，此时z-paging无法得知是否滚动到底部，您可以在页面的<code>onReachBottom</code>中手动调用此方法触发上拉加载更多) <p style="color:red;">ps:<code>use-page-scroll</code>需要设置为true</p></td><td>-</td></tr><tr><td>doChatRecordLoadMore</td><td>手动触发滚动到顶部加载更多，聊天记录模式时有效</td><td>-</td></tr><tr><td>scrollToTop</td><td>滚动到顶部</td><td>参数1(非必填):是否有动画效果，默认为是</td></tr><tr><td>scrollToBottom</td><td>滚动到底部</td><td>参数1(非必填):是否有动画效果，默认为是</td></tr><tr><td>scrollIntoViewById</td><td>滚动到指定view<p style="color:red;">(vue中有效，若此方法无效，请使用<code>scrollIntoViewByNodeTop</code>)</p></td><td>参数1(必填):需要滚动的view的id值，不包含&quot;#&quot;；<br>参数2(非必填):偏移量，单位为px，默认为0；<br>参数3(非必填):是否有动画效果，默认为否</td></tr><tr><td>scrollIntoViewByNodeTop</td><td>滚动到指定view<p style="color:red;">(vue中有效)</p></td><td>参数1(必填):需要滚动的view的top值(通过uni.createSelectorQuery()获取)；<br>参数2(非必填):偏移量，单位为px，默认为0；<br>参数3(非必填):是否有动画效果，默认为否</td></tr><tr><td>scrollIntoViewByIndex</td><td>滚动到指定view<p style="color:red;">(nvue中有效)(在nvue中的cell必须设置 :ref=&quot;<code>z-paging-${index}</code>&quot;)</p></td><td>参数1(必填):需要滚动的view的index(第几个)；<br>参数2(非必填):偏移量，单位为px，默认为0；<br>参数3(非必填):是否有动画效果，默认为否</td></tr><tr><td>scrollIntoViewByView</td><td>滚动到指定view<p style="color:red;">(nvue中有效)</p></td><td>参数1(必填):需要滚动的view(通过<code>this.$refs.xxx</code>获取)；<br>参数2(非必填):偏移量，单位为px，默认为0；<br>参数3(非必填):是否有动画效果，默认为否</td></tr><tr><td>updatePageScrollTop</td><td>当使用页面滚动(z-paging不固定高度)并且自定义下拉刷新时，请在页面的onPageScroll中调用此方法，告知z-paging当前的pageScrollTop，否则会导致在任意位置都可以下拉刷新</td><td>从page的onPageScroll中获取的scrollTop</td></tr><tr><td>updatePageScrollTopHeight</td><td>在nvue中或使用页面滚动并且设置了slot=&quot;top&quot;时，默认初次加载会自动获取其高度，并使内部容器下移，当slot=&quot;top&quot;的view高度动态改变时，在其高度需要更新时调用此方法</td><td>-</td></tr><tr><td>updatePageScrollBottomHeight</td><td>在nvue中或使用页面滚动并且设置了slot=&quot;bottom&quot;时，默认初次加载会自动获取其高度，并使内部容器下移，当slot=&quot;bottom&quot;的view高度动态改变时，在其高度需要更新时调用此方法</td><td>-</td></tr><tr><td>addChatRecordData</td><td>添加聊天记录，<code>use-chat-record-mode</code>为true时有效</td><td>参数1(必填):需要添加的聊天数据，可以是一条数据或一组数据；<br>参数2(非必填):是否滚动到底部，不填默认为true；<br>参数3(非必填):是否使用动画滚动到底部，不填默认为true</td></tr><tr><td>addDataFromTop</td><td>从顶部添加数据，不会影响分页的pageNo和pageSize</td><td>参数1(必填):需要添加的数据，可以是一条数据或一组数据；<br>参数2(非必填):是否滚动到顶部，不填默认为true；<br>参数3(非必填):是否使用动画滚动到顶部，不填默认为true</td></tr><tr><td>resetTotalData</td><td><p style="color:red;">(建议使用v-model代替:list.sync，则无需调用此方法)</p>重新设置列表数据，调用此方法不会影响pageNo和pageSize，也不会触发请求。适用场景：当需要删除列表中某一项时，将删除对应项后的数组通过此方法传递给z-paging。<p style="color:red;">(当出现类似的需要修改列表数组的场景时，请使用此方法，请勿直接修改page中:list.sync绑定的数组)</p></td><td>修改后的列表数组</td></tr><tr><td>getVersion</td><td>获取当前版本号</td><td>-</td></tr><tr><td>setListSpecialEffects</td><td>设置nvue List的specialEffects</td><td>参见<a href="https://uniapp.dcloud.io/component/list?id=listsetspecialeffects" target="_blank" rel="noopener noreferrer">https://uniapp.dcloud.io/component/list?id=listsetspecialeffects<span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">open in new window</span><!--]--></span></a></td></tr></tbody></table><!--]--></div><footer class="page-meta"><!----><!----><!----></footer><!----><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
    <script src="/assets/js/runtime~app.6593e427.js" defer></script><script src="/assets/js/812.dced0ba1.js" defer></script><script src="/assets/js/app.83bf6016.js" defer></script>
  </body>
</html>
